{include file="public_head"}

<script type="text/javascript" src="/static/plupload/plupload.full.min.js"></script>
{include file="public_menu"}
<div class="content_center">
  <div class="main_center">
    <div class="main_left left">
      {include file="public_information_menu"}
    </div>
    <div class="main_right right">
      <div class="order_content">
        <div class="center-return">
          <div class="main_con">
            <div class="title">申请退货</div>
            <div class="tabcon">
              <div id="center">
                <form action="" method="post" id="form">
                  <h4>退款类型</h4>
                  <ul class="tablist1">
                    <li class="cur"><a href="javascript:;">我要退货<span></span></a></li>
                  </ul>
                  <div class="tabcon1">
                    <div class="cur">
                      <h4>退货金额</h4>
                      <input type="number" placeholder="请输入退款金额" class="text" name="amount" datatype="n" errormsg="必须是数字" nullmsg="请填写金额">
                      <input type="hidden" name="type" class="text" value="2">
                      <input type="hidden" name="order_id" class="text" value="{$order.id}">
                      <h4>退货原因</h4>
                      <textarea placeholder="请输入退款说明" class="textarea" name="cause" datatype="n" nullmsg="请填写退货原因"></textarea>
                      <h4>退货说明</h4>
                      <textarea placeholder="请输入退款说明" class="textarea" name="explain" datatype="n" nullmsg="请填写退货说明"></textarea>
                      <h4>上传凭证</h4>
                      <ul class="photo">
                        <li id="btn"><img src="__STATIC__/img/bg27.png"></li>
                        <ul id="ul_pics"></ul>
                        <div id="img3"><input name='picArr[]' id="picArr[]" type='hidden' value=''></div>
                        <div class="cl"></div>
                      </ul>
                    </div>
                  </div>
                  <input type="submit" value="提交申请" id="sub">
                </form>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
<script>

  // 取消上传图片
  function img_del(id, picUrl, url) {

    $.ajax({
      url: url,
      type: 'post',
      dataType: 'json',
      data: {picUrl: picUrl},
      async: true,
      success: function (data) {

        if (data.code == '200') {
          $("#" + id).remove('');
          layer.msg(data.message);

        } else {
          layer.msg(data.message);

          return false;
        }


      }
    });
  }

  // 多图上传
  var uploader = new plupload.Uploader({
    runtimes: 'html5,flash,silverlight,html4',
    browse_button: 'btn',
    url: "{:url('shop/member_order/uploadImg')}",
    flash_swf_url: '__STATIC__/wap/js/plupload/Moxie.swf',
    silverlight_xap_url: '__STATIC__/wap/js/plupload/Moxie.xap',
    filters: {
      max_file_size: '2048kb',
      mime_types: [
        {title: "files", extensions: "jpg,png,gif,jpeg,PNG,JPG,JPEG,GIF"}
      ]
    },
    multi_selection: true,
    init: {
      FilesAdded: function (up, files) {

        if ($("#ul_pics").children("li").length > 7) {
          layer.msg("您上传的图片太多了！");
          uploader.destroy();
        } else {
          var li = '';
          plupload.each(files, function (file) {
            li += "<li id='1" + file['id'] + "'><div class='progress'><span class='bar'></span><span class='percent'>0%</span></div></li>";
          });
          $("#ul_pics").append(li);
          uploader.start();

        }
      },
      UploadProgress: function (up, file) {
        var percent = file.percent;
        $("#1" + file.id).find('.bar').css({"width": percent + "%"});
        $("#1" + file.id).find(".percent").text(percent + "%");
      },
      FileUploaded: function (up, file, info) {
        if ($("#ul_pics").children("li").length > 6) {
          layer.msg("最多只能上传6张图片！");
          $("#1" + file.id).remove('');
          return false;
          uploader.destroy();
        }
        document.getElementById('img3').innerHTML = '';

//                        var data = JSON.parse(info.response);
        var data = eval("(" + info.response + ")");
        $("#1" + file.id).html("<img style='height: 148px;width: 148px;float: left;margin-bottom: 10px;' src='/" + data.picUrl + "'/><input name='picArr' id='picArr[]' type='hidden' value='" + data.picUrl + "'><a style='float: right;margin-top:-5px;position:absolute;margin-left: -10px; ' onclick=img_del('1" + file.id + "','" + data.picUrl + "','{:url(\'member_order/uploadImgDestroy\')}')><img style='height: 10px; width: 10px;' src='__STATIC__/img/icon21.png'/></a>");
      },
      Error: function (up, err) {
        layer.msg('服务器异常,请重新上传');
      }
    }
  });
  uploader.init();

  // 申请退款
  $(function () {
    $.Tipmsg.r = null;
    $.Tipmsg.p = null;
    $('#form').Validform({
      tiptype: function (msg) {
        layer.msg(msg, {icon: 2});
      },
      tipSweep: true,
      btnSubmit: 'sub',
      // ajax 提交
      ajaxPost: true,
      callback: function (t) {
        if (t.code == 200) {
          layer.msg('退货申请成功', {icon: 1});
          setTimeout(function () {
            layer.closeAll('loading');
            // 跳转页面
            location.href = "{:url('shop/member_order/index')}";
          }, 3000);
        } else {
          layer.msg('网络繁忙稍后再试', {icon: 2});
        }

      }
    })
  });
</script>
{include file="public_foot"}
